/*
 * @Author: tom 
 * @Date: 2017-12-22 17:20:14 
 * @Last Modified by: jerry
 * @Last Modified time: 2018-01-30 15:21:49
 */

html {
  // font-family:'PingFangSC-Regular';
  font-family:'MicrosoftYaHei';
  // font-family: Helvetica Neue, Helvetica, Nimbus Sans L, Arial, Liberation Sans, PingFang SC, Hiragino Sans GB, Source Han Sans CN, Source Han Sans SC, Microsoft YaHei, Wenquanyi Micro Hei, WenQuanYi Zen Hei, ST Heiti, WenQuanYi Zen Hei Sharp, sans-serif;
  //10/16   375屏
  font-size:100%; //12/16
  // background-color: #f2f2f2;
  background-color: white;
  color: #000;
  // line-height: 1;
  -webkit-tap-highlight-color: transparent;
   // max-width 大得在上小得在下，min-width 小得在上大得在下
  // @media only screen and (max-width: 384px) {  
  //   font-size:64%!important;
  // }
  // 大部分安卓手机适配  （360/375）*0.625 = 0.6 <= 360
  // @media only screen and (max-width: 360px) {  
  //   font-size:60%!important;
  // }
  // @media only screen and (max-width: 320px) {  
  //   font-size:53%!important;
  // }
  
  // >= 412
  // @media only screen and (min-width: 412px) {
  //   font-size: 68.6%!important;
  // }
  // @media only screen and (min-width: 481px) {
  //   font-size: 94%!important;
  // }
  // @media only screen and (min-width: 561px) {
  //   font-size: 109%!important;
  // }
  // @media only screen and (min-width: 641px) {
  //   font-size: 125%!important;
  // }
  // @media only screen and (min-width: 667px) {
  //   font-size: 111.1666666%!important;
  // }
  // @media only screen and (min-width: 768px) {
  //   font-size: 128%!important;
  // }
  // @media only screen and (min-width: 1024px) {
  //   font-size: 170%!important;
  // }
  // @media only screen and (min-width: 1080px) {
  //   font-size: 180%!important;
  // }
}
/*解决屏幕点击元素出现底色*/
a, button, input, div {
    -webkit-tap-highlight-color: rgba(255, 0, 0, 0);
}
/*解决屏幕点击元素出现底色*/

p,
ul,
h3,
h4 {
  margin-top: 0;
  margin-bottom: 0;
}

ul {
  padding-left: 0;
}

li {
  list-style: none;
}

button,
input,
textarea {
  outline: none;
  border: none;
  line-height: 1.5;
  background-color: transparent;
}

button {
  background-color: transparent;
  padding: 0;
}

a{
  &,
  &:hover,
  &:link,
  &:active,
  &:visited{
    color: 333;
    text-decoration: none;
  }
}
.f,
.f-c,
.f-sb,
.f-sa,
.f-ac,
.f-as,
.f-w,
.f-dc,
.f-fe,
.f-fs,
.f-ais,
.f-ae,
.f-ab {
  display: flex;
}

.f-ab{
  align-items: baseline;
}

.f-ae{
  align-items: flex-end;
}
.f-ais{
  align-items: stretch;
}

.f-fs{
  justify-content:flex-start;
}

.f-fe{
  justify-content: flex-end;
}

.f-w{
  flex-wrap: wrap;
}

.f-c {
  justify-content: center;
}

.f-sb {
  justify-content: space-between;
}

.f-sa {
  justify-content: space-around;
}

.f-ac {
  align-items: center;
}

.f-dc {
  flex-direction: column;
}

.f-as{
  align-items: flex-start;
}

.hidden{
  display: none !important;
}

.opacity-r{
  opacity:0;
}

.visibility{
  visibility: hidden !important;
}

.pos-a{
  position: absolute !important;
}
.pos-r{
  position: relative !important;
}
.pos-f{
  position: fixed !important;
}
.textLeft{
  text-align: left !important;
}